<template>
    <div class="allBody">
        <div class="header">
            <img src="https://pic1.58cdn.com.cn/enterprise/appearance/big/n_v2a849a70cc3144a418d1029c6cb90cad8.jpg" alt="">
            <div class="CompanyName">{{ CompanyName }}</div>
            <div class="CompanyType">公司类型：{{ CompanyType }}</div>
            <div class="CompanyLocation">公司所在地：{{ CompanyLocation }}</div>
            <el-button-group class="btn_ChangeComponent">
                <el-button type="success" plain @click="ShowComInfo()">公司简介</el-button>
                <el-button type="success" plain @click="ShowPosNeeded()">招聘职位</el-button>
            </el-button-group>
        </div>
        <CompanyInfomation v-if="showInfo === true" :companyinfo="CompannyInfoDetail"></CompanyInfomation>
        <PositionNeeded v-if="showInfo === false"></PositionNeeded>
        <div class="foot">
            <div class="exactAddress">
                公司地址：{{ CompanyExactLoaction }}
            </div>
        </div>
    </div>
</template>

<script>
import CompanyInfomation from '@/components/CompanyInfo.vue';
import PositionNeeded from '@/components/PositionNeeded.vue';
import axios from 'D:\\job_management\\src\\axiosConfig.js'

export default {
    data() {
        return {
            CompanyName: '字节跳动',
            CompanyType: '互联网/软件',
            CompanyLocation: '北京',
            activename: '1',
            showInfo: true,
            CompanyExactLoaction: '北京市海淀区西北旺东路10号院1号楼',
            CompannyInfoDetail: ''
        }
    },
    name: 'CompanyInfo',
    components: {
        CompanyInfomation,
        PositionNeeded
    },
    created() {
        axios.get(`/seekers/recommend/company_information/${this.$store.state.companyAccount}`,
            {

            },
            {
                headers: {
                    'Content-Type': 'application/json'
                }
            }
        )
            .then(response => {
                this.CompannyInfoDetail = response.data.data.introduce
                this.CompanyType = response.data.data.companyType
                this.CompanyName = response.data.data.companyName
                this.CompanyLocation = response.data.data.address
                this.CompanyExactLoaction = response.data.data.address



            })
            .catch(error => {
                console.log(error);
            })
    },
    methods: {

        ShowComInfo() {
            this.showInfo = true;
        },
        ShowPosNeeded() {
            this.showInfo = false;
        }
    }
}
</script>
<style scoped>
.allBody {
    width: 1470px;
    height: 700px;
    background-color: rgb(227, 243, 246);
}

.header {
    width: 1470px;
    height: 165px;
    background-color: rgb(0, 180, 179);
}

img {
    position: absolute;
    width: 70px;
    height: 70px;
    left: 7px;
}

.CompanyName {
    position: absolute;
    top: 30px;
    left: 100px;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
}

.CompanyType {
    position: absolute;
    top: 90px;
    left: 20px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}

.CompanyLocation {
    position: absolute;
    top: 90px;
    left: 200px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}

.btn_ChangeComponent {
    position: absolute;
    top: 120px;
    left: 40px;
}

.foot {
    width: 1470px;
    height: 50px;
    position: absolute;
    top: 700px;
    background-color: rgb(0, 180, 179);
    font-size: 15px;
    font-weight: 500;
}

.exactAddress {
    position: absolute;
    top: 10px;
    left: 20px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}
</style>